<template>
    <el-select
        v-model="value"
        :disabled="disabled"
        :remote-method="queryList"
        :size="size"
        :multiple="multiple"
        :type="type"
        remote
        :filterable="filterable"
        :clearable="clearable"
        :collapse-tags="collapseTags"
        style="width: 100%;"
        @change="handleChange"
    >
        <el-option
            v-for="item in dataList"
            :key="item.weekNumber"
            :label="item.weekName"
            :value="item.weekNumber"
        />
    </el-select>
</template>
<script>
import API from 'common/src/api/undGraExamArrange/schoolExamArrange'
import UTILS from 'common/src/utils/utils'

/**
 * 排考周数下拉框组件
 */
export default {
    name: 'ExamWeekSelect',
    props: {
        value: {
            required: true
        },
        calendarId: {
            required: true
        },
        disabled: {
            type: Boolean,
            default: false
        },
        multiple: {
            type: Boolean,
            default: false
        },
        filterable: {
            type: Boolean,
            default: false
        },
        collapseTags: {
            type: Boolean,
            default: false
        },
        size: {
            type: String,
            default: ''
        },
        clearable: {
            type: Boolean,
            default: true
        },
        examType: {
            default: 1
        }
    },
    data() {
        return {
            dataList: []
        }
    },
    computed: {},
    mounted() {
        this.init()
    },
    created() {
        if (this.multiple && !Array.isArray(this.value)) {
            this.$emit('input', [])
        }
        if (!this.multiple && Array.isArray(this.value)) {
            this.$emit('input', '')
        }
    },
    watch: {
        calendarId: {
            handler: function(newVal, oldVal) {
                this.init()
            }
        },
        examType: {
            handler: function(newVal, oldVal) {
                this.init()
            }
        }
    },
    methods: {
        handleChange(val) {
            this.$emit('input', val)
            this.$emit('change', val)
        },
        init() {
            API.listWeekNumber(this.calendarId).then(res => {
                if (res.code == 200) {
                    this.dataList = res.data
                }
            })
        }
    }
}
</script>

<style scoped lang="scss">
</style>
